<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    <title>2017欢天喜地的来了！</title>
    <script type="text/javascript" src="js/script.js" ></script>
    <link rel="stylesheet" href="css/xin.css" />
     <script type="text/javascript">
    	//通过window.screen.width获取屏幕的宽度
        var offWidth = window.screen.width / 30;
        document.getElementsByTagName("html")[0].style.fontSize = offWidth + 'px'; //把rem的值复制给顶级标签html的font-size
    </script>
</head>

<body>
	<audio id="player" src="static/新年的钟声.mp3" autoplay="autoplay" loop="loop"></audio>

	<div id="page1" class='page1'style='display:block'>
		<canvas id="canvas"></canvas>
		<div id='ding'> 
		   <div id="light" class="p_denglong"></div>
		   <div class="p_meihua"></div>
		</div>
		<div id='di'>
		    <div id='zuo' class='p_zuo'></div> 
		    <div id='you' class='p_you'></div>
		</div>
		 <div id='ji'> </div>
		<div id='bi'>
			<div id='left' class='p_left'></div>
		    <div id='right' class='p_right'></div>
		</div>
		<div class="p_bottom"></div>
	</div>
	
	    <div id="page2" class="page2" style="display: none;">
		<div id='p1'><p>等待1分钟后点击文字，进入下一页</p></div>
		<div id='wenzi' class="p2_wenzi">
			<marquee align="center" direction="up" behavior="scroll" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="2" width="300px";"> 
              鸡年未到，祝福先行。<br />
			愿所有的祝福涌向你，是我的期许;<br/>让佳节的喜悦为你洋溢，是我的祝愿;
			<br/>幸福的生活与你拥抱，是我的期望。<br />鸡年期盼你：天天开心!<br />零时的钟声响彻天涯，新年的列车准时出发。
			<br/>它驮去了一个难忘的岁日，迎来了又一轮火红的年华。<br />又是新的一年，让我们共同进步。<br />祝你新年快乐，鹏程万里!
			<sub style="font-size:large;font-weight:200 ;">(1分钟后点击我)</sub>
        </marquee>
		</div>
	    </div>
	
        <div id="page3" class="page3" style="display: none;">
        	<video id="video" width="100%">
			<source src='static/群星 - 哈皮哈多五千年.mp4' type="audio/mp4"></source>
		    </video>
		<div class="p_meihua"></div>
		<div class="p2_2017"></div>
		<div class="p2_zhufu">今年好时辰，群鸡来报喜;<br/>春伊花复开，君亦临其景;<br />祝君年年旺，团团又圆圆!<br />朋友，鸡年快乐!</div>
		<div id="p2_bainian" class="p2_bainian"><a>给您拜年啦！<sub style="font-size: small;font-weight:200 ;">(点击我)</sub></a></div>
		<div class="p2_yinzhang"></div>
		<div class="p2_gongji"></div>
        </div>
    
       <div id="page4" class="page4" style="display: none;">
		<div class="p_meihua"></div>
		<div class="p2_2017"></div>
		<div class="p2_zhufu">扫扫有惊喜！</div>
		<div id="p3_tu" class="p3_tu"></div>
		<div class="p2_yinzhang"></div>
		<div class="p2_gongji"></div>
    </div>
</body>
</html>